<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="/commons/taglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>管理员管理</title>
<link rel="stylesheet" href="${ctx}/static/js/jquery-easyui-1.4.3/themes/bootstrap/easyui.css">
<link rel="stylesheet" href="${ctx}/static/js/jquery-easyui-1.4.3/themes/icon.css">
<link rel="stylesheet" href="${ctx}/static/css/base.css">
<script src="${ctx}/static/js/jquery-1.11.0.min.js"></script>
<script src="${ctx}/static/js/base.js"></script>
<script src="${ctx}/static/js/jquery-easyui-1.4.3/jquery.easyui.min.js"></script>
<script src="${ctx}/static/js/jquery-easyui-1.4.3/easyui-lang-zh_CN.js"></script>
<style type="text/css">
	#btn-search.l-btn {
	    background-position: right 0;
	    font-size: 12px;
	    text-decoration: none;
	    display: inline-block;
	    zoom: 1;
	    height: 26px;
	    padding: 0px 5px;
	    cursor: pointer;
	    outline: none;
	}
</style>
<script type="text/javascript">
	$(function(){
		$("#dataList").datagrid({   
		    url:"${ctx}/adminUser/dataList",
		    method:"post",
		    loadMsg:"处理中，请稍候…",
		    toolbar:"#toolbar",
		    idField:"adminId",
		    striped:true,
		    rownumbers:true,
		    fitColumns:true,
		    fit:true,
		    pagination:true,
		    pageNumber:1,
		    pageSize:2,
		    pageList:[1,10,20,30,40,50],
		    columns:[[   
		        {field:'adminId',checkbox:true},   
		        {field:'nickName',title:'昵称',sortable:true},   
		        {field:'userName',title:'用户名',sortable:true},
		        {field:'locked',title:'是否锁定',align:'center',formatter:function(value,row,index){ 
			         	if(value!=null){
			         		if(value=="1"){
			         			 return "是";  
				         	}else{
				         		return "否";  
					        }
				        }
                	}  
                },
		        {field:'email',title:'邮箱',sortable:true},
		        {field:'lastLoginTime',title:'最近登录时间',align:'center',sortable:true,formatter:function(value,row,index){ 
			         	if(value!=null){
			         		var date = new Date(value);  
		                    return date.getFullYear()+'-'+(date.getMonth()+ 1)+'-'+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds(); 
				        }
                    }  
                },
		        {field:'createDate',title:'创建时间',align:'center',sortable:true,formatter:function(value,row,index){ 
			         	if(value!=null){
			         		var date = new Date(value);  
		                    return date.getFullYear()+'-'+(date.getMonth()+ 1)+'-'+date.getDate()+" "+date.getHours()+":"+date.getMinutes()+":"+date.getSeconds();
				        }
                	}
                },
		        {field:'roleNames',title:'角色'}
		    ]]   
		}); 
		$("#btn-search").click(function(){
			var param = $("#searchForm").serializeObject();
			$("#dataList").datagrid('reload',param);
		});
	});

	/**
	 * 新增用户
	 */
	function newUser(){
		$("#edit-win").dialog({
			buttons:[
				{
					text:'保  存',
					iconCls: 'icon-ok',
					handler:function(){
						if($("#editForm").form('validate')){
							$('#editForm').form('submit',{
								url:'${ctx}/adminUser/create',
								success:function(result){
									var param = $("#searchForm").serializeObject();
									$("#dataList").datagrid('reload',param);
									$("#edit-win").dialog('close');
								}
							});
						}
					}
				},
				{
					text:'关  闭',
					iconCls: 'icon-cancel',
					handler:function(){
						$("#edit-win").dialog('close');
					}
				}
		]});
		$("#edit-win").dialog('open');
		$("#editForm").resetForm();
	}
</script>
</head>
<body class="easyui-layout"> 
	<!-- Search panel start -->
 	<div class="ui-search-panel" region="north" style="height: 80px;" title="搜索框" data-options="striped: true,collapsible:true,iconCls:'icon-search',border:false" >  
	 	 <form id="searchForm">
	 	 	<p class="ui-fields">
	            <label class="ui-label">用户名:</label>
	            <input name="userName" class="easyui-box ui-text" style="width:100px;">
	            <label class="ui-label">邮箱:</label>
	            <input name="email" class="easyui-box ui-text" style="width:100px;">
	        </p>
	        <a href="#" id="btn-search" class="easyui-linkbutton" iconCls="icon-search">Search</a>
	      </form>  
    </div> 
   	<!--  Search panel end -->
    <div region="center" border="false" style="border-top-width: 0px;">
    	<div id="toolbar">
			<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newUser()">新增</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editUser()">编辑</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyUser()">删除</a>
		</div>
		<table id="dataList">
		</table>
	</div>
 	<!-- Edit Form -->
    <div id="edit-win" class="easyui-dialog" title="编辑页面" data-options="closed:true,iconCls:'icon-save',modal:true" style="width:400px;height:300px;">  
    	<form id="editForm" class="ui-form" method="post">  
    		 <input class="hidden" type="text" name="id">
    		 <input class="hidden" name="deleted">
    		 <div class="ui-edit">
     	   		<div class="ftitle">管理员信息</div>    
	            <div class="fitem">  
	               <label>用户名:</label>  
	               <input class="easyui-validatebox" type="text" name="userName" data-options="required:true,validType:'length[1,10]'">
	            </div>
	            <div class="fitem">  
	               <label>密码:</label>  
	               <input class="easyui-validatebox" type="text" name="password" data-options="required:true,validType:'length[6,10]'">
	            </div>
	            <div class="fitem">  
	               <label>昵称:</label>  
	               <input class="easyui-validatebox" type="text" name="nickName" data-options="required:true,validType:'length[1,20]'">
	            </div>
	            <div class="fitem">
	               <label>邮箱:</label>  
	               <input class="easyui-validatebox" type="text" name="email" data-options="required:true,validType:'email'">
	            </div>
	            <div class="fitem">  
	               <label>是否锁定:</label>  
	               <select class="easyui-combobox" name="locked" data-options="required:true">
	                   	<option value="0" selected="selected">否</option>
	                   	<option value="1">是</option>
	               </select>
	            </div> 
         	</div>
    	</form>
 	 </div> 
</body>
</html>